<%--
  Created by IntelliJ IDEA.
  User: Lanan
  Date: 2018/1/3 0003
  Time: 11:04
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/global.jsp" %>
<html>
<head>
    <%@ include file="/commons/basejs.jsp" %>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>用户优惠券管理</title>
</head>
<body>

<div class="easyui-layout" fit="true" >
    <div data-options="region:'west',split:true,border:false" title="用户列表" style="width:40%;">
        <table id="coupon_user_grid" class="easyui-datagrid"
               data-options="
		   		url:'${path }/userInfo/dataGrid.do',
		   		fit:true,
		   		idField:'id',
		   		sortName : 'id',
                sortOrder : 'asc',
		   		rownumbers:true,
		   		toolbar:'#coupon_user_tools',
		   		pagination:true,
		   		fitColumns:true,
		   		singleSelect:true,
		   		onClickRow:function(index, row){
		   		    getUserCouponApply(row.id);
		   		},
		   		">
            <thead>
                <th data-options="field:'username', align:'center'">用户名</th>
                <th data-options="field:'phone', align:'center'">手机</th>
                <th data-options="field:'email', align:'center'">邮箱</th>
            </thead>
        </table>
        <div id="coupon_user_tools">
            <form id="coupon_user_form">
                用户名：<input style="width: 90px" class="easyui-textbox" data-options="prompt:'请输入用户名'" type="text" id="couponUserName" name="usernameSearchWord"/>

                手机：<input style="width: 120px" class="easyui-numberbox" data-options="prompt:'请输入手机'" type="text" id="couponUserPhone" name="phoneSearchWord"/>

                邮箱：<input style="width: 120px" class="easyui-textbox" data-options="prompt:'请输入邮箱'" type="text" id="couponUserEnail" name="emailSearchWord"/>


                <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" onclick="searchCouponUser()">搜索</a>
                <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-search'" onclick="resetCouponUserSearch()">重置</a>
            </form>
        </div>
    </div>

    <script type="text/javascript">

        function getUserCouponApply(userId) {
            var select = $("#user_conpon_grid").datagrid("getSelected");
            if(select != null){
                $('#user_conpon_grid').datagrid('clearSelections');
            }
            var queryParams = {};
            queryParams.userId = userId;
            var options = $("#user_conpon_grid").datagrid('getPager').data("pagination").options;
            options.pageNumber = 1;
            //重新加载
            $("#user_conpon_grid").datagrid('options').queryParams = queryParams;
            $("#user_conpon_grid").datagrid('reload');
        }

        function searchCouponUser() {
            var queryParams = {};
            queryParams.usernameSearchWord = $("#couponUserName").val();
            queryParams.phoneSearchWord =$("#couponUserPhone").val();
            queryParams.emailSearchWord =$("#couponUserEnail").val();
            var options = $("#coupon_user_grid").datagrid('getPager').data("pagination").options;
            options.pageNumber = 1;
            //重新加载
            $("#coupon_user_grid").datagrid('options').queryParams = queryParams;
            $("#coupon_user_grid").datagrid('reload');
        }
        
        function resetCouponUserSearch() {
            $("#coupon_user_form").form("clear");
        }

    </script>

    <div data-options="region:'center',split:true,border:false" title="用户优惠券列表" style="width:60%;">
        <table id="user_conpon_grid" class="easyui-datagrid"
               data-options="
		   		url:'${path}/user/coupon/list.do',
		   		fit:true,
		   		idField:'id',
		   		rownumbers:true,
		   		toolbar:'#user_conpon_tools',
		   		pagination:true,
		   		fitColumns:true,
		   		singleSelect:true
		   		">
            <thead>
            <th data-options="field:'id', align:'center', checkbox:true">ID</th>
            <th data-options="field:'userName',align:'center'">用户名</th>
            <th data-options="field:'name',align:'center'">优惠券名称</th>
            <th data-options="field:'intro',align:'center',width:50">优惠券描述</th>
            <th data-options="field:'providerType',formatter:
            function(value){if(value) return '平台';return '商家'},align:'center'">提供者</th>
            <th data-options="field:'type',formatter:
            function(value){if(value==1) return '满折';
            if(value==2)return '现金';
            return '满减'},align:'center'">优惠类型</th>
            <th data-options="field:'subtractionMoney',align:'center'">满减限额</th>
            <th data-options="field:'money',align:'center'">满减/现金金额</th>
            <th data-options="field:'discount',align:'center',formatter:
            function(value){var a = value * 100; return a + '%'}">折扣</th>
            <th data-options="field:'maxDiscountMoney',align:'center'">最多折扣金额</th>
            <th data-options="field:'used',align:'center', formatter:usedFormatter">使用状态</th>
            </thead>
        </table>

        <div id="user_conpon_tools">
            <shiro:hasPermission name="/user/coupon/grant.do">
                <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-ok'" onclick="grantCouponToUser()">发放</a>
            </shiro:hasPermission>
            <shiro:hasPermission name="/user/coupon/delete.do">
                <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-remove'" onclick="deleteUserCoupon()">删除</a>
            </shiro:hasPermission>
        </div>

        <%--编辑与添加分类--%>
        <div class="easyui-dialog" id="grantCouponToUserDialog" data-options="closed:true,modal:true,width:400,height:260">
            <form id="grantCouponToUserForm" method="post">
                <table align="center" width="100%" style="margin-top: 20px" cellpadding="4">
                    <tr>
                        <td align="right" width="30%"><lable for="def">用户:</lable></td>
                        <td>
                            <div style="position: relative;height:15px;width:170px;">
                                <input type="text" name="userId" id="grant_user" value="" hidden/>
                                <input type="text" id="autocomplete-ajax-user-grant" class="easyui-validatebox" data-options="missingMessage:'请输入用户信息'" style="position: absolute; z-index: 2; background: transparent;"/>
                                <input type="text" id="autocomplete-ajax-user-grant-x" disabled="disabled" style="color: #CCC; position: absolute; background: transparent; z-index: 1;"/>
                            </div>
                        </td>
                    </tr>
                    <tr></tr>
                    <tr></tr>
                    <tr>
                        <td align="right" width="30%"><lable for="def">优惠券:</lable></td>
                        <td>
                            <div style="position: relative;height:15px;width:170px;">
                                <input type="text" name="couponId" id="grant_coupon" value="" hidden/>
                                <input type="text" id="autocomplete-ajax-coupon-grant" class="easyui-validatebox" data-options="missingMessage:'请输入优惠券名称'" style="position: absolute; z-index: 2; background: transparent;"/>
                                <input type="text" id="autocomplete-ajax-coupon-grant-x" disabled="disabled" style="color: #CCC; position: absolute; background: transparent; z-index: 1;"/>
                            </div>
                        </td>
                    </tr>
                </table>
            </form>
            <div style="margin-top: 50px;text-align: center">
                <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-save'", onclick="grantCoupon()">发放</a>
                <a href="#" class="easyui-linkbutton" data-options="iconCls:'icon-cancel'", onclick="$('#grantCouponToUserDialog').dialog('close')">取消</a>
            </div>
        </div>
    </div>

    <script type="text/javascript">

        $(function () {
            autoCompleteDate('${path}/user/address/autoCompleteData.do', 'autocomplete-ajax-user-grant', 'grant_user', 'autocomplete-ajax-user-grant-x');

            autoCompleteDate('${path}/user/coupon/autoCompleteData.do', 'autocomplete-ajax-coupon-grant', 'grant_coupon', 'autocomplete-ajax-coupon-grant-x');
        })

        function usedFormatter(value) {
            if(value == 1) {
                return  '<span style="color:green">' + '未使用' + '</span>';
            } else if(value == 0) {
                return  '<span style="color:lightgrey">' + '已使用' + '</span>';
            }
        }

        function grantCouponToUser() {
            $("#grantCouponToUserForm").form("clear");
            $("#grantCouponToUserDialog").dialog({title: "发放优惠券到指定用户"});
            $("#grantCouponToUserDialog").dialog("open");
        }
        
        function grantCoupon() {
            var userId = $("#grant_user").val();
            if (userId == null || userId == "" || userId.length <= 0) {
                $.messager.alert("提示","请选择正确的用户！！","info");
                return;
            }
            var coupondId = $("#grant_coupon").val()
            if (coupondId == null || coupondId == "" || coupondId.length <= 0) {
                $.messager.alert("提示","请选择正确的优惠券！！","info");
                return;
            }

            lananUpdateOrInsert("发放", "${path}/user/coupon/grant.do", "grantCouponToUserForm", "grantCouponToUserDialog", "user_conpon_grid")
        }
        
        function deleteUserCoupon() {
            var url = "${path}/user/coupon/delete.do";
            lananDelete("user_conpon_grid", "你确定要删除该用户优惠券?", url);
        }

    </script>
</div>
</body>
</html>
